<template>
	<div id="friend-merchant-manage" class="w-h-100 pos-r flex-1 apply-container" style="box-sizing: border-box; overflow: hidden">
		<div class="w-h-100 ver-flex pos-a" style="box-sizing: border-box; padding: 6px">
			<div class="search-s page-public-s" style="box-sizing: border-box">
				<el-card shadow="never" :body-style="{ paddingBottom: '0' }">
					<el-form class="box-f" ref="queryForm" :inline="true">
						<!-- <el-form-item label="项目阶段：">
							<el-select v-model="transferVal2" placeholder="请选择项目阶段" style="width: 100%">
								<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
							</el-select>
						</el-form-item> -->
						<!-- <el-form-item label="项目名称：">
                            <el-input v-model="transferVal1" placeholder="请输入项目名称" />
                        </el-form-item> -->
						<!-- <el-form-item label="项目负责人：">
							<el-select v-model="transferVal3" placeholder="请选择项目负责人" style="width: 100%">
								<el-option v-for="item in option4" :key="item.value" :label="item.label" :value="item.value" />
							</el-select>
						</el-form-item> -->

						<el-form-item>
							<el-button v-if="$hasPer('ConcurrentManagement1:add')" @click="nodeClick" icon="ele-Plus" type="primary"> 新增 </el-button>
							<el-button v-if="$hasPer('ConcurrentManagement7:excel')" @click="handleExport" icon="ele-Download"> 导出数据 </el-button>
						</el-form-item>
					</el-form>
				</el-card>
			</div>

			<div style="box-sizing: border-box" class="flex-1 pos-r">
				<div class="pos-a w-h-100" style="box-sizing: border-box">
					<el-card class="box-card w-h-100" shadow="never" style="margin-top: 16px">
						<div style="" class="w-h-100 ver-flex">
							<div class="flex-1 pos-r">
								<div class="pos-a w-h-100">
									<el-table ref='excelRef' :data="list" class="w-h-100" style="width: 100%" border v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.5)">
										<el-table-column type="index" label="序号" width="55" :show-overflow-tooltip="true" align="center" :index="indexMethod" />
										<el-table-column min-width="120" :show-overflow-tooltip="true" label="项目名称" align="center" >
											<el-table-column min-width="120" :show-overflow-tooltip="true" align="center">
												<template #header>
													<SearchModel typeId="project_Name" typeVal="select" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
												</template>
												<template #default="{ row }">
													{{ row.project_Name }}
												</template>
											</el-table-column>
										</el-table-column>
										<el-table-column min-width="100" :show-overflow-tooltip="true"  label="阶段名称" align="center" >
											<el-table-column min-width="120" :show-overflow-tooltip="true" align="center">
												<template #header>
													<SearchModel typeId="stage_Name" typeVal="select" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
												</template>
												<template #default="{ row }">
													{{ row.stage_Name }}
												</template>
											</el-table-column>
										</el-table-column>
										<el-table-column min-width="100" :show-overflow-tooltip="true" label="项目编号" align="center" >
											<el-table-column min-width="120" :show-overflow-tooltip="true" align="center">
												<template #header>
													<SearchModel typeId="projectCode" typeVal="input" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
												</template>
												<template #default="{ row }">
													{{ row.projectCode }}
												</template>
											</el-table-column>
										</el-table-column>
							
										<el-table-column min-width="120" :show-overflow-tooltip="true" label="项目负责人" align="center" >
											<el-table-column min-width="120" :show-overflow-tooltip="true" align="center">
												<template #header>
													<SearchModel typeId="empName" typeVal="select" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
												</template>
												<template #default="{ row }">
													{{ row.empName }}
												</template>
											</el-table-column>
										</el-table-column>
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="startDate" :formatter="formatDate" label="开始日期" align="center" />
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="endDate" :formatter="formatDate" label="完工日期" align="center" />
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="acceptanceDate" :formatter="formatDate" label="验收日期" align="center" />
										<el-table-column min-width="100" :show-overflow-tooltip="true" prop="project_Name" label="状态" align="center">
											<template v-slot="scope">
												{{ scope.row.isComplete ? '已完成' : '未完成' }}
											</template>
										</el-table-column>
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="createdTime" label="创建时间" align="center" />
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="createdUserName" label="创建人" align="center" />
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="updatedTime" label="更新时间" align="center" >
                                            <template #default="scope">
                                                    <span v-if="scope.row.product_Description">{{ scope.row.product_Description }}</span>
                                                    <span v-else> - </span>
                                                </template>
                                        </el-table-column>
										<el-table-column min-width="120" :show-overflow-tooltip="true" prop="updatedUserName" label="更新人" align="center" >
                                            <template #default="scope">
                                                    <span v-if="scope.row.product_Description">{{ scope.row.product_Description }}</span>
                                                    <span v-else> - </span>
                                                </template>
                                        </el-table-column>

										<el-table-column min-width="200" label="操作" align="center" fixed="right">
											<el-table-column min-width="200" align="center" fixed="right">
												<template #header>
													<el-button @click="searchClick" icon="ele-Search" type="primary" text> 查询 </el-button>
													<el-button @click="resetClick" icon="ele-Refresh" text> 重置 </el-button>
												</template>
												<template #default="scope">
													<div class="operate-s">
														<el-button v-if="$hasPer('ConcurrentManagement2:create')" @click="queryClick(scope.row)" class="icon-e" icon="ele-DocumentAdd" size="small" text type="primary"> 资料填报 </el-button>
														<el-button v-if="$hasPer('ConcurrentManagement3:edit')" @click="nodeClick(scope.row)" class="icon-e" icon="ele-Edit" size="small" text type="primary"> 编辑 </el-button>
														<el-button v-if="$hasPer('ConcurrentManagement4:delete')" @click="deleteHandle(scope.row.n_Id, getData)" class="icon-e" icon="ele-Delete" size="small" text type="danger"> 删除 </el-button>
													</div>
												</template>
											</el-table-column>
										</el-table-column>
									</el-table>
								</div>
							</div>
							<div style="height: 30px; margin-top: 20px" class="hr-flex-start">
								<el-pagination
									v-model:currentPage="pageNo"
									v-model:page-size="pageSize"
									:total="totalRows"
									:page-sizes="[10, 20, 50, 100]"
									small
									background
									@size-change="handleSizeChange"
									@current-change="handleCurrentChange"
									layout="total, sizes, prev, pager, next, jumper"
									class="w-h-100"
								/>
							</div>
						</div>
					</el-card>
				</div>
			</div>
		</div>
		<!-- 新增and编辑 -->
		<el-dialog draggable :close-on-click-modal="false" :close-on-press-escape="false" v-model="showDialogVisible" :title="saveId ? '编辑' : '新增'" width="50%" @close="cancelUseClick">
			<el-form label-width="100px" :model="ruleForm" ref="ruleFormRef" size="default" :rules="rules">
				<el-divider content-position="left"> 基本信息 </el-divider>
				<el-row :gutter="35">
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="stage_Id" label="项目阶段">
							<el-select v-model="ruleForm.stage_Id" placeholder="项目阶段" style="width: 100%">
								<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="project_Name" label="项目名称">
							<el-input v-model="ruleForm.project_Name" placeholder="项目名称" clearable />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="projectLeaderId" label="项目负责人">
							<el-select ConcurrentManagement v-model="ruleForm.projectLeaderId" placeholder="项目负责人" style="width: 100%">
								<el-option v-for="item in option4" :key="item.value" :label="item.label" :value="item.value" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="projectCode" label="项目编号">
							<el-input v-model="ruleForm.projectCode" placeholder="项目编号" clearable />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item prop="startDate" label="开始日期">
							<!-- <el-input v-model="ruleForm.startDate" placeholder="开始日期" clearable /> -->
							<el-date-picker style="width: 100%" v-model="ruleForm.startDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="开始日期" />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" v-if="saveId">
						<el-form-item prop="endDate" label="完工日期">
							<!-- <el-input v-model="ruleForm.endDate" placeholder="完工日期" clearable /> -->
							<el-date-picker style="width: 100%" v-model="ruleForm.endDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="完工日期" />
						</el-form-item>
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" v-if="saveId">
						<el-form-item prop="acceptanceDate" label="验收日期">
							<!-- <el-input v-model="ruleForm.acceptanceDate" placeholder="验收日期" clearable /> -->
							<el-date-picker style="width: 100%" v-model="ruleForm.acceptanceDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="验收日期" />
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>

			<template #footer>
				<span class="dialog-footer">
					<el-button @click="cancelUseClick">取消</el-button>
					<el-button type="primary" @click="controlUseClick(ruleFormRef, getData)">确定</el-button>
				</span>
			</template>
		</el-dialog>
		<!-- 详细信息 -->
		<DetailedInfo draggable :close-on-click-modal="false" :close-on-press-escape="false" :showInfoDialog="showInfoDialog" :currentRecord="currentRecord" @closeDialog="closeDialog" :infoData="infoData" @uploadFileTodoItemChange="uploadFileTodoItemChange" />
	</div>
</template>

<script lang="ts">
import { defineComponent, ref, onMounted, reactive } from 'vue';
import getTableData from '/@/utils/getTableData';
import { ElMessageBox, ElMessage, FormInstance } from 'element-plus';
import useCurrentInstance from '/@/utils/hook/useCurrentInstance';
import DetailedInfo from './component/DetailedInfo.vue';
// import uploadFile from "./component/uploadFile.vue"
import { deleteProjectFileApi, getProjectDetailApi } from '/@/api/sms/HazardousChemicalsInterface';
// import { getProjectTodoApi } from "/@/api/sms/HazardousChemicalsInterface"
import SearchModel from '/@/views/sms/component/search-model.vue';
import { sysFileInfoMultipleUpload, sysFileInfoPage, sysFileInfoDelete, sysFileInfoPreviewBase64 } from '/@/api/centerControl/pubilc';
import { exportToExcel } from '/@/utils/exportToExcel';
import {
	getConcurrentManagementApi,
	AddConcurrentManagementApi,
	GetProjectPhaseApi,
	getEmployeeIdApi,
	deleteConcurrentManagementApi,
	updateConcurrentManagementApi,
	getProjectTodoApi,
	uploadProjectFileApi,
} from '/@/api/sms/HazardousChemicalsInterface';
import { pa } from 'element-plus/es/locale';
export default defineComponent({
	name: 'friend-merchant-manage',
	components: {
		// AddEditFriendMerchantManage,
		DetailedInfo,
        SearchModel
		// uploadFile
	},
	setup(props) {
		const { proxy } = useCurrentInstance();
		const $t = proxy.$t;

		/***** 变量 *****/
		const transferVal1 = ref(); // 需要查询的值
		const transferVal2 = ref(); // 需要查询的值
		const transferVal3 = ref(); // 需要查询的值
		const showDialogVisible = ref(false);
		const dialogTitle = ref('新增');
		const ruleForm: any = reactive({
			stage_Id: '',
			project_Name: '',

			projectLeaderId: '', //项目负责人，请求 /sysEmp/selector
			projectCode: '', //项目编号
			startDate: '', //开始日期
			endDate: '', //完工日期
			acceptanceDate: '', //验收日期
		});

		const queryFormData: any = reactive({});

		const rules = reactive({
			project_Name: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
			stage_Id: [{ required: true, message: '内容不能为空', trigger: 'blur' }],

			projectLeaderId: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
			projectCode: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
			startDate: [{ required: true, message: '内容不能为空', trigger: 'blur' }],
		});

		const resetClick = () => {
			searInfo.value = {};
			let newObj = Object.keys(queryFormData);
			if (newObj.length !== 0) {
				newObj.map((i: any) => {
					queryFormData[i] = '';
					// console.log(i);
				});
			}
			initInfoFun();
		};

		/***** searchClick 查询按钮 *****/
		const searchClick = () => {
			let newObj = Object.keys(searInfo.value);
			if (newObj.length !== 0) {
				newObj.map((i: any) => {
					queryFormData[i] = searInfo.value[i];
				});
			}
		};

		//详情
		const showInfoDialog = ref(false);
		const infoData = ref<any>();
		const queryId = ref(0);
		const currentRecord = ref()
		const queryClick = async (item: any) => {
			currentRecord.value = ''
			queryId.value = item.n_Id;
			currentRecord.value = item
			const res = await getProjectDetailApi({ ProjectId: item.n_Id });
			infoData.value = res.data.rows;
			showInfoDialog.value = true;
		};

		/*** nodeClick 新增/编辑点击事件 */
		// url: '/ProviderProduct/Query', url: '/OMS/Provider/Queryv2',
		const ruleFormRef = ref();
		const options1: any = ref([]);
		const options2: any = ref([]);
		const saveId = ref();
		const nodeClick = async (obj: any) => {
			if (obj.n_Id) {
				saveId.value = obj.n_Id;
				ruleForm.project_Name = obj.project_Name;
				ruleForm.stage_Id = obj.stage_Id;

				ruleForm.projectLeaderId = Number(obj.projectLeaderId); //项目负责人，请求 /sysEmp/selector
				ruleForm.projectCode = obj.projectCode; //项目编号
				ruleForm.startDate = obj.startDate; //开始日期
				ruleForm.endDate = obj.endDate; //完工日期
				ruleForm.acceptanceDate = obj.acceptanceDate; //验收日期
			}
			showDialogVisible.value = true;
		};

		/*** cancelUseClick 取消事件 */
		const cancelUseClick = () => {
			ruleForm.project_Name = '';
			ruleForm.stage_Id = '';
			// transferVal1.value = "";
			transferVal2.value = '';
			transferVal3.value = '';
			saveId.value = 0;
			showDialogVisible.value = false;

			ruleForm.projectLeaderId = ''; //项目负责人，请求 /sysEmp/selector
			ruleForm.projectCode = ''; //项目编号
			ruleForm.startDate = ''; //开始日期
			ruleForm.endDate = ''; //完工日期
			ruleForm.acceptanceDate = ''; //验收日期
		};

		/*** controlUseClick 提交事件 */
		const controlUseClick = async (formEl: FormInstance | undefined, updateFun: Function) => {
			if (!formEl) return;
			await formEl.validate((valid, fields) => {
				if (valid) {
					if (ruleForm.startDate && ruleForm.endDate) {
						let data1 = new Date(ruleForm.startDate);
						let data2 = new Date(ruleForm.endDate);
						if (data1.getTime() > data2.getTime()) {
							proxy.$message.error('开始日期不能大于结束日期');
							return;
						}
					}
					if (ruleForm.endDate && ruleForm.acceptanceDate) {
						let data1 = new Date(ruleForm.endDate);
						let data2 = new Date(ruleForm.acceptanceDate);
						if (data1.getTime() > data2.getTime()) {
							proxy.$message.error('完工日期不能大于验收日期');
							return;
						}
					}
					console.log('submit!');
					if (saveId.value) {
						const obj = Object.assign({ ...ruleForm, projectId: saveId.value });
						updateConcurrentManagementApi(obj).then(() => {
							cancelUseClick();
							updateFun();
						});
					} else {
						AddConcurrentManagementApi(ruleForm).then(() => {
							cancelUseClick();
							updateFun();
						});
					}
				} else {
					console.log('error submit!', fields);
				}
			});
		};

		/*** deleteHandle 删除数据事件 */
		const deleteHandle = async (val: String | Number, updateFun: Function) => {
			ElMessageBox.confirm('请确定删除此条数据', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning',
			})
				.then(async () => {
					let param = { id: val };
					try {
						let res: any = await deleteConcurrentManagementApi(param);
						if (res.success) {
							updateFun();
						}
					} catch (err) {
						return;
					}
				})
				.catch(() => {
					ElMessage({
						type: 'info',
						message: '删除失败',
					});
				});
		};

		const projectPhaseList = ref([]);
		const option4: any = ref([]);
		const options8: any = ref([]);
		onMounted(async () => {
			const res = await GetProjectPhaseApi();
			projectPhaseList.value = res.data;
			res.data.forEach((element: any) => {
				options1.value.push({
					label: element.stage_Name,
					value: element.n_Id,
				});
			});
			const res1 = await getEmployeeIdApi();
			option4.value = res1.data.map((element: any) => {
				return {
					label: element.name,
					value: element.id,
				};
			});

			await initInfoFun();

			const res2 = await getConcurrentManagementApi({pageSize: 10000, pageNo: 1})
			res2.data.rows.forEach((element: any) => {
				options8.value.push({
					label: element.project_Name,
					value: element.project_Name,
				});
			});
		});

		/*** 附件管理 */
		const fileInfo = ref();
		const fileDialog = ref(false);
		/*** cancelFileClick 文件上传取消事件 */
		const cancelFileClick = () => {
			fileDialog.value = false;
		};
		/*** controlFileClick 文件上传提交事件 */
		const controlFileClick = () => {
			fileDialog.value = false;
		};
		/*** documentClick 文档下载事件 */
		const documentClick = async (val: any) => {
			val.fileType = 2;
			val.sourceType = 8;
			val.id = val.n_Id;
			val.titleCon = '附件下载';
			fileInfo.value = JSON.stringify(val);
			fileDialog.value = true;
		};

		const formUploadData = reactive({
			projectPhaseId: '',
			Files: [],
		});

		const rulesUpload = reactive({
			projectPhaseId: [{ required: true, message: '请选择项目阶段', trigger: 'blur' }],
			Files: [{ required: true, message: '请上传文件', trigger: 'blur' }],
		});
		// 文件下载
		const showUploadDialog = ref(false);
		let fileList: any = [];
		const refFile = ref();
		const uploadId = ref();
		const submitUpload = async (formEl: FormInstance | undefined) => {
			if (!formEl) return;
			await formEl.validate((valid, fields) => {
				if (valid) {
					console.log('submit!');
					uploadProjectFileApi({ Files: formUploadData.Files, SourceId: formUploadData.projectPhaseId }).then(() => {
						closeUpload();
						formUploadData.projectPhaseId = '';
					});
				} else {
					console.log('error submit!', fields);
				}
			});
		};
		const closeUpload = () => {
			showUploadDialog.value = false;
			refFile.value.handleRemove(fileList);
			refFile.value.handleRemove(formUploadData.Files);
			formUploadData.Files = [];
			formUploadData.projectPhaseId = '';
			fileList = [];

			projectId.value = 0;
			fileData.value = [];
			formUploadData1.projectPhaseId = '';
			activeName.value = 'upload';
			formRefUpload.value.clearValidate();
			refFile.value.clearFiles();
		};
		const formRefUpload = ref();
		/*** handleChange 文件上传改变事件 */
		const handleChange = (file: any) => {
			fileList.push(file);
			if (fileList.length !== 0) {
				fileList.map((i: any) => {
					formUploadData.Files.push(i.raw);
				});
			}
		};

		const handleRemove = (file: any) => {
			fileList.map((itm: any, inx: number) => {
				if (file.uid === itm.uid) {
					fileList.splice(inx, 1);
				}
			});
			refFile.value.handleRemove(file);
		};
		// const filesTwo = ref();
		const submitForm = () => {
			let setArr: any = [];
			if (fileList.length !== 0) {
				fileList.map((i: any) => {
					setArr.push(i.raw);
				});
				uploadFileFun(setArr, uploadId.value);
			} else {
				ElMessage({
					type: 'error',
					message: '请选择需要上传的文件',
					duration: 1500,
				});
			}
		};
		const uploadFileFun = async (file: any, id: number) => {
			let param: any = {};
			param.files = file;
			param.sourceId = id;
			param.sourceType = 8;
			await sysFileInfoMultipleUpload(param);
		};
		const options3: any = ref([]);
		const documentUploadClick = async (val: any) => {
			uploadId.value = val.n_Id;
			options3.value = [];
			const res = await getProjectTodoApi({ ProjectId: val.n_Id });
			res.data.rows.forEach((item: any) => {
				if (item.canDo) {
					options3.value.push({ label: item.stage_Name, value: item.n_Id });
				}
			});
			showUploadDialog.value = true;
		};

		const closeDialog = () => {
			showInfoDialog.value = false;
		};

		const uploadFileTodoItemChange = async () => {
			const res = await getProjectDetailApi({ ProjectId: queryId.value });
			infoData.value = res.data.rows;
		};

		// 文件下载
		const fileData = ref();
		/*** getPageFile 获取分页文件接口数据 */
		const getPageFile = async (id: Number) => {
			let param: any = {};
			param.PageNo = 1;
			param.PageSize = 99999;
			param.sourceId = id;

			let res: any = await sysFileInfoPage(param);
			if (res.success && res.data.rows.length !== 0) {
				fileData.value = res.data.rows;
			} else {
				fileData.value = [];
			}
		};

		/*** downClick 下载文件 */
		const downClick = async (val: any) => {
			let getFile = getFileFun(val.id);
			// 等待getFileFun完成
			await getFile;
			if (getFile && getFile.then) {
				getFile.then((res) => {
					let base64Data = res;
					let blob = base64ToBlob(base64Data);

					// 创建可下载的链接
					let url = URL.createObjectURL(blob);
					let link = document.createElement('a');
					link.href = url;
					link.download = val.fileOriginName; // 指定下载的文件名

					// 将链接添加到DOM中
					document.body.appendChild(link);

					// 触发点击事件开始下载
					link.click();

					// 释放临时URL
					URL.revokeObjectURL(url);
				});
			}
		};
		const getFileFun = async (val: Number) => {
			let param: any = {};
			param.id = val;
			let res: any = await sysFileInfoPreviewBase64(param);
			if (res.success) {
				return res.data;
			}
		};

		// 将Base64编码数据转换为Blob对象的辅助函数
		const base64ToBlob = (base64Data: any) => {
			var byteString = atob(base64Data.split(',')[1]); // 提取Base64编码的数据部分
			var mimeString = base64Data.split(':')[1].split(';')[0]; // 提取MIME类型
			var ab = new ArrayBuffer(byteString.length);
			var ia = new Uint8Array(ab);
			for (var i = 0; i < byteString.length; i++) {
				ia[i] = byteString.charCodeAt(i);
			}
			return new Blob([ab], { type: mimeString });
		};

		/*** delClick 删除文件事件 */
		const delClick = async (val: Number) => {
			let param: any = {
				fileId: val || 0, // 文件id
				projectTodoId: projectId.value, // 项目代办id
			};
			let res: any = await deleteProjectFileApi(param);
			if (res.success) {
				getPageFile(projectId.value);
			}
		};

		const formUploadData1: any = reactive({
			projectPhaseId: '',
		});
		const handleSearch = () => {
			getPageFile(formUploadData1.projectPhaseId);
		};

		const projectId = ref(0);
		const projectPhaseChange = (val) => {
			projectId.value = val;
		};

		const activeName = ref('upload');
		const handleClick = () => {};

		/*** 初始化数据 */
		const basicsInfo: any = ref([]);
		const initInfoFun = () => {
			basicsInfo.value = [
				{
					typeId: 'project_Name', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
					typeNam: '', // 输入类型(number,text等) --- 选填
					searchVal: 'Name', // 查询字段 --- 必填
					defaultVal: '', // 字段默认值 --- 选填
					placeholder: '项目名称', // placeholder数据
					defaultProp: options8.value, // 下拉框中使用，除下拉框外其它情况为空 --- 选填
					eventType: '', // 事件类型（如burl/change等） --- 选填
					defaultEvent: '', // 事件名称 --- 选填
				},
                {
					typeId: 'projectCode', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
					typeNam: '', // 输入类型(number,text等) --- 选填
					searchVal: 'ProjectCode', // 查询字段 --- 必填
					defaultVal: '', // 字段默认值 --- 选填
					placeholder: '项目编号', // placeholder数据
					defaultProp: '', // 下拉框中使用，除下拉框外其它情况为空 --- 选填
					eventType: '', // 事件类型（如burl/change等） --- 选填
					defaultEvent: '', // 事件名称 --- 选填
				},
				{
					typeId: 'stage_Name', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
					typeNam: '', // 输入类型(number,text等) --- 选填
					searchVal: 'StageId', // 查询字段 --- 必填
					defaultVal: '', // 字段默认值 --- 选填
					placeholder: '项目阶段', // placeholder数据
					defaultProp: options1.value, // 下拉框中使用，除下拉框外其它情况为空 --- 选填
					eventType: '', // 事件类型（如burl/change等） --- 选填
					defaultEvent: '', // 事件名称 --- 选填
				},
                {
					typeId: 'empName', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
					typeNam: '', // 输入类型(number,text等) --- 选填
					searchVal: 'ProjectLeaderId', // 查询字段 --- 必填
					defaultVal: '', // 字段默认值 --- 选填
					placeholder: '项目负责人', // placeholder数据
					defaultProp: option4.value, // 下拉框中使用，除下拉框外其它情况为空 --- 选填
					eventType: '', // 事件类型（如burl/change等） --- 选填
					defaultEvent: '', // 事件名称 --- 选填
				},
			];
		};

		const searInfo: any = ref();
		const searchHandel = (val: any) => {
			searInfo.value = val;
		};

        /*** 截取日期格式方法 */
		const formatDate = (row: any, column: any) => {
			// 获取单元格数据
			let data = row[column.property];
			if (data == null) {
				return '-';
			}
			if (data === '1900-01-01 00:00:00') {
				return '-';
			}
			let dt = new Date(data);
			let month = dt.getMonth() + 1 < 10 ? '0' + (dt.getMonth() + 1) : dt.getMonth() + 1;
			let date = dt.getDate() < 10 ? '0' + dt.getDate() : dt.getDate();
			return dt.getFullYear() + '-' + month + '-' + date;
		};

		  /*** ================================= 导出数据函数操作 ================================= */
		  const excelRef: any = ref(null);
        const handleExport = () => {
            if(excelRef.value){
                if(excelRef.value.data.length !== 0){
                    let tableExcel: any = [];
                    let tableArr = excelRef.value.data;
                    tableArr.map((item: any) => {
                        let tableObj: any = {};
                        tableObj['阶段名称'] = item.stage_Name ? item.stage_Name : '-';
                        tableObj['项目编号'] = item.projectCode ? item.projectCode : '-';
						tableObj['项目名称'] = item.project_Name ? item.project_Name : '-';
                        tableObj['项目负责人'] = item.empName ? item.empName : '-';
                        tableObj['开始日期'] = item.startDate ? item.startDate : '-';
                        tableObj['完工日期'] = item.endDate ? item.endDate : '-';
                        
						tableObj['验收日期'] = item.acceptanceDate ? item.acceptanceDate : '-';
                        tableObj['状态'] = item.project_Name ? '已完成' : '未完成';

                        tableObj['创建人'] = item.createdUserName ? item.createdUserName : '-';
                        tableObj['创建时间'] = item.createdTime ? item.createdTime : '-';
                        tableObj['更新人'] = item.updatedUserName ? item.updatedUserName : '-';
                        tableObj['更新时间'] = item.updatedTime ? item.updatedTime : '-';
                        tableExcel.push(tableObj);
                    });
                    exportToExcel(tableExcel,'风险辨识清单.xlsx');
                }else{
                    ElMessage({
                        type: 'error',
                        message: '暂无数据导出',
                    })
                }
            }
        }

		return {
			...getTableData(getConcurrentManagementApi, {}, queryFormData),
			cancelUseClick,
			controlUseClick,
            formatDate,
			nodeClick,
			deleteHandle,
			searchClick,
			transferVal1,
			transferVal2,
			transferVal3,
			/***/
			showDialogVisible,
			dialogTitle,
			ruleForm,
			options1,
			options2,
			saveId,
			rules,
			resetClick,
			ruleFormRef,
			queryClick,
			showInfoDialog,
			infoData,
			cancelFileClick,
			controlFileClick,
			documentClick,
			fileDialog,
			fileInfo,
			options3,
			formUploadData,
			closeDialog,
			// 上传
			showUploadDialog,
			closeUpload,
			formRefUpload,
			handleRemove,
			submitUpload,
			submitForm,
			handleChange,
			documentUploadClick,
			refFile,
			rulesUpload,
			//下载
			fileData,
			downClick,
			delClick,
			handleSearch,
			projectId,
			projectPhaseChange,
			handleClick,
			activeName,
			formUploadData1,
			option4,
			uploadFileTodoItemChange,
			searchHandel,
			basicsInfo,
			handleExport,excelRef,
			options8,
			currentRecord
		};
	},
});
</script>

<style lang="scss">
@import '../style/public.scss';
</style>

<style scoped lang="scss">
#friend-merchant-manage {
	.box-f {
		:deep(.el-form-item__label) {
			padding: 0;
		}
	}

	:deep(.el-card__body) {
		height: 100%;
	}

	:deep(.el-card) {
		border: none !important;
	}

	.upload-demo {
		margin-left: 12px;
		margin-top: 2px;
	}

	ul {
		list-style: none;

		li {
			cursor: pointer;

			&:hover {
				color: red;
			}
		}
	}

	.icon-e {
		:deep(.el-icon) {
			margin-right: 0px !important;
		}
	}
}
</style>
